<template>
  <el-dialog :visible.sync="visible" v-dialogDrag :title="title" class="tl-dialog" width="1300px" @open="open" @close="close" :close-on-click-modal="false" :close-on-press-escape="false">
    <div class="app-container">
      <!-- 查询 -->
      <tl-list-search ref="search" :query-param="queryParam" @search="doQuery" :isDisplayDefaultSearch="false" v-if="isHeaderDisplay">
        <template slot="search">
          <el-form-item label="统计周期" prop="date">
            <el-date-picker :picker-options="rangeOption" v-model="startandenddate" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" @change="changedate"></el-date-picker>
          </el-form-item>
          <el-form-item label="部门">
            <el-select style="width:180px" v-model="createdepart" placeholder="请选择部门名称" filterable collapse-tags clearable multiple @change="doQueryConcatCreateDepart">
              <el-option v-for="item in codeModel.deptCommonCodeList" :key="item.code" :label="item.name" :value="item.code" />
            </el-select>
          </el-form-item>
           <el-form-item label="采购模式">
            <el-select style="width:180px" v-model="purchasepattern" placeholder="请选择采购模式" filterable collapse-tags clearable multiple @change="doQueryConcatMpmPurchasePattern">
              <el-option v-for="item in codeModel.MpmPurchasePatternList" :key="item.code" :label="item.name" :value="item.code" />
            </el-select>
          </el-form-item>
          <el-form-item label-width="0">
            <el-switch v-model="userflag" active-text="项目经理" active-value="manager" inactive-text="" inactive-value="dept" @change="doQuery"> </el-switch>
          </el-form-item>
        </template>
      </tl-list-search>
      <!-- 工具栏 -->
      <tl-list-toolbar ref="toolbar" @add="openAddDialog('editForm')" @exportExcel="doExportExcel" @deleteBatch="doDeleteBatch" @refresh="doRefresh" @columnCustomize="doColumnCustomize" @displaySearch="doDisplaySearch" :disableDeleteBatch="selectedRowKeys.length <= 0" :isDisplayAdd="false" :isDisplayDeleteBatch="false">
        <template slot="left-btn"> </template>
      </tl-list-toolbar>
      <!--表格渲染-->
      <el-table class="tl-table" ref="mainTable" resizable-key="tableHeight" :resizable-refs="tableResizeRefs" v-loading="loading" :data="datas" @selection-change="doSelectChange" @sort-change="doSortChange" row-key="id" border fit :row-class-name="doChangeRowClassName">
        <el-table-column type="index" label="序号" width="55px" align="center"></el-table-column>
        <el-table-column prop="dispdeptcommoncode" label="部门" min-width="200px" align="center" header-align="center" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column prop="projectmanager" label="项目经理" width="100px" align="center" header-align="center" :show-overflow-tooltip="true" v-if="userflag === 'manager'"></el-table-column>
        <el-table-column prop="alevelcount" label="A级项目数量" width="120px" align="center" header-align="center" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column prop="meetneed" label="应开次数" width="120px" align="center" header-align="center" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column prop="meetactual" label="实开次数" width="120px" align="center" header-align="center" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column prop="haveratio" label="召开率" width="120px" align="center" header-align="center" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column prop="noweekcount" label="未开周数" width="120px" align="center" header-align="center" :show-overflow-tooltip="true"></el-table-column>
      </el-table>
    </div>
  </el-dialog>
</template>

<script>
/** mixins */
import { mixin_list } from '@tapui/mixins/mixin_list'
import { validateNull } from '@tapui/utils/validate'
import { exportExcelAxio } from '@tapui/api/office'
import { formatDate } from '@tapui/utils/date'
import { filterObjectNull, rmbFormat } from '@tapui/utils/util'
/** 工具类 */
import { getAction, putAction, postAction, deleteAction } from '@tapui/utils/http'
const baseUrl = process.env.BASE_API
export default {
  name: 'meetStat',
  mixins: [mixin_list],
  components: {},
  data() {
    return {
      description: '销售项目超期记录-列表查询',
      urlPrefix: '/mpm/project/',
      url: {
        list: '/mpm/project/queryMeetStatInfo',
        exportExcel: '/mpm/project/meetExportExcel',
        queryCodeList: '/mpm/pMOStandardizationRecord/dataCodeList'
      },
      // 排序参数
      sorterInfo: {
        sidx: 'sortcode',
        sord: 'asc'
      },
      startandenddate: [],
      createdepart: [],
      purchasepattern: [],
      userflag: 'dept',
      title: '项目周会统计',
      visible: false,
      isQueryOnCreated: false,
      get rangeOption() {
        // 解决默认写法 this 指向问题
        let that = this
        return {
          disabledDate(date) {
            let now = new Date()
            let tempdate = new Date(date)
            // 往年不控制 未来年份禁用
            if (now.getFullYear() > tempdate.getFullYear()) {
              return false
            } else {
              return now.getMonth() < tempdate.getMonth()
            }
          }
        }
      }
    }
  },
  methods: {
     /** 查询编码 */
    doQueryCode() {
      if (this.url.queryCodeList) {
        getAction(this.url.queryCodeList, {}).then((res) => {
          if (res.success) {
            res.result.MpmPurchasePatternList = res.result.MpmPurchasePatternList.filter(item => Number(item.code) > 10)
            this.codeModel = res.result
          } else {
            this.$tap.alert(res.message, 'warning')
          }
        })
      }
    },
    open() {
      this.$nextTick(() => {
        this.startandenddate.push(this.getNowMonthFirst())
        this.startandenddate.push(this.getNowMonthLast())
        this.changedate(this.startandenddate)
        this.loadData()
      })
    },
    close() {
      this.startandenddate = []
      this.createdepart = []
      this.purchasepattern = []
      this.userflag = 'dept'
      this.queryParam = {}
      this.visible = false
    },
    getNowMonthFirst() {
      const date = new Date()
      date.setDate(1)
      return formatDate(date, 'yyyy-MM-dd')
    },
    getNowMonthLast() {
      const date = new Date()
      const enddate = new Date(date.getFullYear(), date.getMonth() + 1, 0)
      return formatDate(enddate, 'yyyy-MM-dd')
    },
    changedate(data) {
      if (validateNull(data)) {
        this.queryParam.startdate = null
        this.queryParam.enddate = null
      } else {
        this.queryParam.startdate = data[0]
        this.queryParam.enddate = data[1]
      }
    },
    // 部门名称多选框
    doQueryConcatCreateDepart(data) {
      if (data.length > 0) {
        this.queryParam.qry_deptcommoncode = data
          .map((item) => {
            return "'" + item + "'"
          })
          .join(',')
      } else {
        this.queryParam.qry_deptcommoncode = null
      }
    },
    // 采购模式多选框
    doQueryConcatMpmPurchasePattern(data) {
      if (data.length > 0) {
        this.queryParam.qry_purchasepattern = data
          .map((item) => {
            return "'" + item + "'"
          })
          .join(',')
      } else {
        this.queryParam.qry_purchasepattern = null
      }
    },
    getQueryParams() {
      let param = {}
      if (this.superQueryParams) {
        param['superQueryParams'] = encodeURI(this.superQueryParams)
      }
      Object.assign(param, this.queryParam, this.sorterInfo, this.filtersInfo)
      param.currentPage = this.pageInfo.currentPage
      param.pageSize = this.pageInfo.pageSize
      param.userflag = this.userflag
      return filterObjectNull(param)
    },
    afterLoadData() {
      this.$refs.mainTable.doLayout()
    }
  }
}
</script>

<style scoped></style>
